import ayyModal from './ayy-modal.vue'
// #ifdef VUE2
import Vue from 'vue'
// #endif
// #ifdef VUE3
import {
	createApp
} from 'vue'
const app = createApp(ayyModal);
// #endif
import util from './util.js'
import config from './config.js'

// #ifdef APP
let pushing = false //正在跳转中
let pushingTempOptions = null
// #endif

// #ifdef MP
const instanceList = []
// #endif
//弹窗组件实例
let instance = null

//弹窗数据缓存
const dataList = []

/**
 * @description 初始化模态框全局实例并挂载（H5有效）
 * @param {Object} store vuex实例，若后续弹窗中有用到vuex，需要导入才能使用(目前用不到)
 */
const shareInstance = (store) => {
	// #ifdef H5
	//extend挂载的组件无法使用store，这里需要将store注册进去
	if (instance == null) {
		// #ifdef VUE2
		const ModalConstructor = Vue.extend(ayyModal)
		instance = new ModalConstructor({
			store
		})
		instance.id = "ayy-modal-container"
		instance.vm = instance.$mount()
		document.body.appendChild(instance.vm.$el)
		instance.vm.visible = true
		instance.dom = instance.vm.$el
		// instance.dom.style.zIndex = 9999
		// #endif

		// #ifdef VUE3
		// 创建模态框容器并设置属性
		const modalContainer = document.createElement('ayy-modal')
		modalContainer.id = "ayy-modal-container"
		document.body.appendChild(modalContainer)
		// 挂载 Vue 应用实例到容器
		instance = app.mount(modalContainer)
		// 设置模态框的可见性
		app.config.globalProperties.$modalVisible = true
		// #endif
	}
	console.log('【ayy-modal】组件单例初始化成功')
	// #endif
}

/**
 * @description 传递的组件实例（微信小程序必须得每个页面都导入<ayy-modal></ayy-modal>并且将组件实例传递过来才可以操作）
 */
const initInstance = ayyModalRef => {
	// #ifdef MP
	if (ayyModalRef) {
		instance = ayyModalRef
		const findIndex = instanceList.findIndex(obj => obj.$data.modalValueKey == ayyModalRef.$data.modalValueKey)
		if (findIndex == -1) {
			instanceList.push(ayyModalRef)
		}
	}
	// #endif
}

/**
 * @description 消除组件实例（微信小程序必须得每个页面都导入<ayy-modal></ayy-modal>，在页面销毁时需要将组件实例移除，并将组件实例指向堆栈的最后一个实例）
 */
const removeInstance = ayyModalRef => {
	// #ifdef MP
	if (ayyModalRef) {
		const findIndex = instanceList.findIndex(obj => obj.$data.modalValueKey == ayyModalRef.$data.modalValueKey)
		if (findIndex != -1) {
			instanceList.splice(findIndex, 1)
		}
		if (instanceList.length > 0) {
			instance = instanceList[instanceList.length - 1]
		}
	}
	// #endif
}

/**
 * @description 将需要显示的弹窗数据导入弹窗组件中(只操作当前显示的弹窗，不显示弹窗后续会自动调用更新)
 * @param {Object} options 弹窗数据
 * @param {Boolean} showLog 是否打印日志
 */
const update = (options, showLog = true) => {
	if (dataList.length > 0 && options.key === dataList[dataList.length - 1].key) {
		// #ifdef H5 || MP
		// Object.assign(instance.$data, options) //浅合并，并且源数据没有目标数据的属性时，目标数据还会保留原属性以及属性值，这不是我们想要的
		Object.keys(instance.$data).forEach(vmKey => {
			let hasVmKey = false
			Object.keys(options).forEach(key => {
				instance[key] = options[key]
				if (key === vmKey || vmKey === 'modalValueKey') {
					hasVmKey = true
				}
			})
			if (!hasVmKey) {
				instance[vmKey] = null
			}
		})
		// #endif

		// #ifdef APP
		uni.$emit('updateAyyModalData', options)
		// #endif

		if (showLog) {
			console.log(`【ayy-modal】key=>${options.key} 数据导入成功`)
		}
	} else {
		if (showLog) {
			console.log(`【ayy-modal】key=>${options.key} 非可视弹窗，数据延后导入`)
		}
	}
}

/**
 * @description 移除所有弹窗（静默移除）
 * @param {String} excludeKeys 排除项，多个用','隔开
 */
const removeAll = (excludeKeys = "") => {
	if (dataList.length == 0) return
	if (excludeKeys == "") {
		dataList.splice(0, dataList.length)
		// #ifdef H5 || MP
		instance.show = false
		// #endif
		// #ifdef APP
		uni.navigateBack()
		// #endif
	} else {
		let excludeKeysList = excludeKeys.split(",")
		let excludeDataList = []
		dataList.forEach(obj => {
			if (excludeKeysList.includes(obj.key)) {
				console.log(`【ayy-modal】弹框key=>${obj.key}被保留`)
				excludeDataList.push(obj)
			}
		})
		dataList.splice(0, dataList.length)
		if (excludeDataList.length > 0) {
			dataList.push(...excludeDataList)
			update(dataList[dataList.length - 1], true)
		} else {
			// #ifdef H5 || MP
			instance.show = false
			// #endif
			// #ifdef APP
			uni.navigateBack()
			// #endif
		}
	}
	console.log('【ayy-modal】移除弹窗成功')
}

/**
 * @description 移除单个弹框（静默移除）
 * @param {String} 弹窗唯一key值  
 */
const remove = (key) => {
	if (util.empty(key)) return
	if (dataList.length == 0) return

	const findIndex = dataList.findIndex(obj => obj.key == key)
	if (findIndex == -1) return
	dataList.splice(findIndex, 1)
	if (dataList.length == 0) {
		// #ifdef H5 || MP
		instance.show = false
		// #endif
		// #ifdef APP
		uni.navigateBack()
		// #endif
	} else {
		let currentData = dataList[dataList.length - 1]
		update(currentData, true)
	}
	console.log(`【ayy-modal】key=${key}移除弹窗成功`)
}

/**
 * @description 展示模态框
 * @param {Object} options
	{
		key: "弹窗数据唯一标识，不传会自动生成相同key值视为同一弹窗不重复渲染，设置后不宜中途修改",
		titleIcon: "标题图标",
		title: "标题",
		content: "内容",
		contentMode: "text、rich-text、html",// text|rich-text|html
		showCancel: true,
		cancelText: "取消",
		confirmText: "确定",
		
		editable: false, // 是否显示输入框
		inputMode: "input", //input | textarea
		placeholderText: "请输入",
		inputText: null,
		asyncClose: false,// 是否异步关闭模态窗（只针对确定按钮），为true时需要调用者自己关闭模态窗
		
		modalStyle: null,// 弹窗容器样式[Object]
		cancelColor: "var(--text-auxiliary)",
		confirmColor: "var(--uni-color-primary)",
		titleIconStyle: null,// [String,Object]
		titleStyle: null,// [String,Object]
		contentStyle: null,// [String,Object]
		cancelStyle: null,// [String,Object]
		confirmStyle: null,// [String,Object]
		confirmFun: null,// 确定按钮回调（APP端confirmFun回调中若有页面跳转需要延迟一点点再跳转）
		cancelFun: null,// 取消按钮回调
	}
 */
const show = (options = {}) => {
	//key值生成
	if (util.empty(options.key)) {
		options.key = util.guid()
	}

	//弹窗去重
	let findIndex = dataList.findIndex(obj => obj.key === options.key)
	if (findIndex != -1) {
		console.log('【ayy-modal】存在相同key弹窗，旧弹窗已被删除')
		dataList.splice(findIndex, 1)
	}

	//默认参数初始化
	options.show = true
	if (util.empty(options.contentMode)) {
		options.contentMode = 'text'
	}
	if (util.empty(options.showCancel)) {
		options.showCancel = true
	}
	if (util.empty(options.editable)) {
		options.editable = false
	}
	if (util.empty(options.asyncClose)) {
		options.asyncClose = false
	}
	if (options.editable) {
		if (util.empty(options.inputMode)) {
			options.inputMode = 'input'
		}
		if (util.empty(options.placeholderText)) {
			options.placeholderText = '请输入'
		}
	}

	//弹窗数据加入全局缓存
	dataList.push(options)

	if (instance == null) {
		shareInstance()
	}

	options.closeModalFun = res => {
		dataList.pop()
		if (dataList.length == 0) {
			// #ifdef H5 || MP
			instance.show = false
			// #endif
			// #ifdef APP
			uni.navigateBack()
			// #endif
		} else {
			let currentData = dataList[dataList.length - 1]
			update(currentData, true)
		}
	}

	// #ifdef APP
	if (dataList.length == 1) {
		pushing = true
		uni.navigateTo({
			url: '/ayy-modal/components/ayy-modal/ayy-modal',
			complete: () => {
				pushing = false
				update(options, false)
				if (pushingTempOptions) {
					update(pushingTempOptions, false)
					pushingTempOptions = null
				}
			}
		})
	} else {
		if (pushing) {
			pushingTempOptions = options
		} else {
			update(options, false)
		}
	}
	// #endif
	// #ifndef APP
	update(options, false)
	// #endif

	return options
}

const $ayyModal = {
	show,
	update,
	remove,
	removeAll,
	config,
	initInstance, //外部不需要调用（switchTab页面需要调用此方法切换instance实例，具体参考README用法）
	removeInstance, //外部不需要调用
}

uni.$ayyModal = $ayyModal
// #ifndef APP-NVUE
// nvue页面不支持Vue.prototype挂载
// #ifdef VUE3
//因为app是单独的vue实例，所以这里这样设置，在页面面中使用this.$ayyModal调用会起不来，上下文不一致，（推荐直接使用uni.$ayyModal）
// app.config.globalProperties.$ayyModal = $ayyModal
// #endif
// #ifdef VUE2
Vue.prototype.$ayyModal = $ayyModal
// #endif

// #endif

export default {
	shareInstance,
	config
}